'use strict';

import React, { Component } from 'react';

import {
  StyleSheet,
  View,
  ScrollView,
  TouchableOpacity,
  Text,
  Keyboard
} from 'react-native';

import Config from '../../config';
import SizeUtils from '../../common/SizeUtils';
import CommonStyles from '../../common/CommonStyles';
import TImage from '../../components/TImage';
import BaseItem from '../common/BaseItem';
import NewsConstants from '../../common/NewsConstants';
import NewsVideoView from '../news/NewsVideoView';
import CommonShowViewFullScreenAction from '../../actions/common/CommonShowViewFullScreenAction';
import {DateUtils} from '../../utils/Utils';
import ActivityListItemView from '../activity/ActivityListItemView';
import HeartLoveItemView from '../heart/HeartLoveItemView';
import QuanziPostListItemView from '../quanzi/QuanziPostListItemView';

export default class SearchItemView extends Component {
    render() {
      const {data, index,type,loveData,keyWord}=this.props;
      if(type == "activities") {
        return <ActivityListItemView key={index} keyWord={keyWord} data={data}/>
      }
      else if(type == "lovers") {
        return <HeartLoveItemView key={index} keyWord={keyWord} data={data} myLoveData={loveData}/>
      }
      else if(type == "posts") {
        return <QuanziPostListItemView user_id={this.props.pageData.routeData.userData.user_id} boardName={data.boardName} isNoFollow={true} key={index} keyWord={keyWord} data={data.post!==undefined?data.post:data} />
      }
      else if(type == "innovation") {
        return <Item data={data.post} key={index} number={index} keyWord={keyWord} type={type}/>;
      }
      //有图片才显示
      // else if(data.image_url || (data.image_urls && data.image_urls && data.image_urls.length > 0)) {
      else {
        return <Item data={data} key={index} number={index} keyWord={keyWord} type={type}/>;
      }
    }
}

class Item extends BaseItem {
  constructor(props) {
    super(props);
  }
  _renderShowImageO(data) {
    if (
      data.image_url ||
      (data.image_urls && data.image_urls && data.image_urls.length > 0)
    ) {
      if (data.image_urls.length===1) {
        return (
        <View
          style={{ flexDirection: "row", justifyContent: "space-between" }}
        >
              {this._renderShowOneImage(data)}
        </View>
      );
      }
      return (
        <View
          style={{ flexDirection: "row", justifyContent: "space-between" }}
        >
              {this._renderShowThreeImage({ uri: data.image_urls[0]||'' })}
              {this._renderShowThreeImage({ uri: data.image_urls[1]||'' })}
              {this._renderShowThreeImage({ uri: data.image_urls[2]||'' })}
        </View>
      );
    }
  }
  _renderShowOneImage(data) {
    if (
      data.image_url ||
      (data.image_urls && data.image_urls && data.image_urls.length > 0)
    ) {
      return (
        <TImage
          source={this._getImageSource(data)}
          style={{ width: 750, height: 450 }}
          resizeMode={"cover"}
          miniSize={'mini500'}
          isMini={true}
        />
      );
    }
  }
  render() {
    const { number,data,type,keyWord} = this.props;
    const strat = this.props.data.title.indexOf(keyWord);
    const str1 = this.props.data.title.substr(0,strat);
    const str2 = this.props.data.title.substr(strat,keyWord.length);
    const str3 = this.props.data.title.slice(strat+keyWord.length);
    if (number===0&&type==='news') {
      return(
        <TouchableOpacity onPress={this._onPressItem.bind(this)}
        style={{flex:1,
            paddingTop:SizeUtils.translateDesignHeightToCode(20),
            paddingBottom:SizeUtils.translateDesignHeightToCode(10),
            paddingLeft:SizeUtils.translateDesignWidthToCode(20),
            borderTopWidth:SizeUtils.translateDesignNumToCode(3),
            borderBottomWidth:SizeUtils.translateDesignNumToCode(3), borderColor:"#eeeeee",
            paddingRight:SizeUtils.translateDesignWidthToCode(20)}}>
          <View style={{flex:1, flexDirection: "column",
                paddingTop:SizeUtils.translateDesignHeightToCode(0),
                paddingBottom:SizeUtils.translateDesignHeightToCode(10),}}>
              <Text numberOfLines={1}
                style={[CommonStyles.primaryText, {marginTop:SizeUtils.translateDesignHeightToCode(10),
                      marginBottom:SizeUtils.translateDesignHeightToCode(15),fontWeight:"bold",
                      color:'#000',fontSize:SizeUtils.translateFontSizeToCode(30),}]}>
                  {str1}<Text style={{color:'red',fontWeight:'bold'}}>{str2}</Text>{str3}
              </Text>
              {this._renderShowImageO(this.props.data)}
              {this._newsBottomView()}
          </View>
        </TouchableOpacity>
      );
    }
    if (type==='innovation') {
      return (
        <TouchableOpacity onPress={this._onPressItem.bind(this)}
          style={{flex:1, flexDirection:"row",
            paddingTop:SizeUtils.translateDesignHeightToCode(10),
            paddingBottom:SizeUtils.translateDesignHeightToCode(10),
            borderBottomWidth:SizeUtils.translateDesignNumToCode(3), borderColor:"#eeeeee",
            paddingLeft:SizeUtils.translateDesignWidthToCode(20),
            paddingRight:SizeUtils.translateDesignWidthToCode(20)}}>
          {this._renderShowImage(this.props.data)}
          <View style={{flex:1, flexDirection: "column", justifyContent:"space-between",
                paddingLeft:SizeUtils.translateDesignWidthToCode(20),
                paddingTop:SizeUtils.translateDesignHeightToCode(10),
                paddingBottom:SizeUtils.translateDesignHeightToCode(10),}}>
              <Text numberOfLines={1}
                style={[CommonStyles.primaryText, {marginTop:SizeUtils.translateDesignHeightToCode(10),
                      marginBottom:SizeUtils.translateDesignHeightToCode(10),
                      color:'#000',fontSize:SizeUtils.translateFontSizeToCode(28),}]}>
                  {str1}<Text style={{color:'red',fontWeight:'bold'}}>{str2}</Text>{str3}
              </Text>
              {this._newsBottomView()}
          </View>
        </TouchableOpacity>
      )
    }
    return (
      <TouchableOpacity onPress={this._onPressItem.bind(this)}
        style={{flex:1, flexDirection:"row",
            paddingTop:SizeUtils.translateDesignHeightToCode(25),
            paddingBottom:SizeUtils.translateDesignHeightToCode(20),
            borderBottomWidth:SizeUtils.translateDesignNumToCode(3), borderColor:"#eeeeee",
            paddingLeft:SizeUtils.translateDesignWidthToCode(20),
            paddingRight:SizeUtils.translateDesignWidthToCode(20)}}>
          {this._renderShowImage(this.props.data)}
          <View style={{flex:1, flexDirection: "column", justifyContent:"space-between",
                paddingLeft:SizeUtils.translateDesignWidthToCode(20),
                paddingTop:SizeUtils.translateDesignHeightToCode(10),
                paddingBottom:SizeUtils.translateDesignHeightToCode(0),}}>
              <Text numberOfLines={2}
                style={[CommonStyles.primaryText, {color:'#000',
                  marginBottom:SizeUtils.translateDesignHeightToCode(10),
                  fontWeight:"bold",
                  fontSize:SizeUtils.translateFontSizeToCode(30),}]}>
                  {str1}<Text style={{color:'red',fontWeight:'bold'}}>{str2}</Text>{str3}
              </Text>
              {type==='news'?this._newsBottomView():this._renderDate(this.props.data,type)}
          </View>
      </TouchableOpacity>
    )
  }
  _renderDate(data,type) {
    if (type==='vipsercard_content') {
      return(
        <View style={{flexDirection:"row", paddingTop:SizeUtils.translateDesignHeightToCode(13)}}>
          <Text style={{fontSize:SizeUtils.translateFontSizeToCode(28), color:"#968a88"}}
            numberOfLines={1} >{"发布时间：" + this._getTimeStr(data.posted_at)}</Text>
        </View>
      )
    }
    return(<View/>)
  }

  _getTimeStr(time) {
    var timeStr = DateUtils.formatActivity(time)
    return timeStr;
  }
  _workHardBottomView=()=>(
    <View style={{flexDirection:'row',paddingTop:SizeUtils.translateDesignHeightToCode(10),alignItems: 'center',}}>
        <Text
            numberOfLines={1}
            style={[CommonStyles.secondaryText, {flex:1,fontSize:SizeUtils.translateFontSizeToCode(26)}]}>
            {this.props.data.content}
        </Text>
        <View style={{flexDirection:'row',}}>
        <Text  style={[CommonStyles.secondaryText,{marginLeft:5,fontSize:SizeUtils.translateFontSizeToCode(26)}]}>
          {DateUtils.formatDateMnD(this.props.data.posted_at)}
        </Text>
      </View>
    </View> 
  );
  _newsBottomView=()=>(
    <View style={{flexDirection:'row',paddingTop:SizeUtils.translateDesignHeightToCode(20),alignItems: 'center',}}>
        <Text
            style={[CommonStyles.secondaryText, {flex:1,fontSize:SizeUtils.translateFontSizeToCode(24),
                }]}>
            {this._getDateSource(this.props.data)}
        </Text>
        <View style={{flexDirection:'row',alignItems: 'center',justifyContent: 'center',}}>
        {/**<TImage source={require("../../../resource/images/home/zan.png")} 
            style={{width:34,height:34,}}/>
        <Text  style={[CommonStyles.secondaryText,{fontSize:SizeUtils.translateFontSizeToCode(24)}]}>
          {' '+this.props.data.likers_num}
        </Text>
        <TImage source={require("../../../resource/images/home/kan.png")} 
            style={{marginLeft:10,width:34,height:34,}}/>
        <Text  style={[CommonStyles.secondaryText,{fontSize:SizeUtils.translateFontSizeToCode(24)}]}>
          {' '+this.props.data.readers_num}
        </Text>**/}
        <Text  style={[CommonStyles.secondaryText,{marginLeft:10,fontSize:SizeUtils.translateFontSizeToCode(24)}]}>
          {DateUtils.formatActivity1(this.props.data.posted_at)}
        </Text>
      </View>
    </View> 
  );
  _renderShowThreeImage(data) {
    if (data.image_url || (data.image_urls && data.image_urls && data.image_urls.length > 0)) {
      return <TImage source={this._getImageSource(data)} miniSize={'mini500'}
        style={{width: (750-50)/3, height:150}} resizeMode={"cover"} isMini={true}/>
    }
  }
  _renderShowImage(data) {
    if (data.image_url || (data.image_urls && data.image_urls && data.image_urls.length > 0)) {
      return <TImage source={this._getImageSource(data)}
        style={{width:220, height:140}} resizeMode={"cover"} isMini={true}/>
    }
  }

  _getImageSource(data) {
    if(data.image_url) {
      return {uri:data.image_url};
    }
    else if (data.image_urls && data.image_urls && data.image_urls.length > 0) {
      return {uri:data.image_urls[0]};
    }
    else {
      return {uri:""};
    }
  }

  _getBottomText() {
    if(this.props.type == "workHard") {
      return this.props.data.likers_num + " 赞 · " + this.props.data.comments_num +
        " 评论 " + this.props.data.readers_num + " 阅读 " + DateUtils.formatDateMnD(this.props.data.posted_at);
    }
    else if(this.props.type == "news") {
      return this._getDateSource(this.props.data) + " " + DateUtils.formatDateMnD(this.props.data.posted_at) + " 浏览:" + this.props.data.readers_num;
    }
  }

  _getDateSource(data) {
    if(data.source) {
      return  data.source;
    }
    return "";
  }
  _onPressItem() {
    if(this.props.type == "news") {
      if(this.props.data.tag == NewsConstants.type_shipin) {
        new CommonShowViewFullScreenAction().call(this, {component:NewsVideoView, data:this.props.data})
      }
      else {
        this.gotoPage(Config.pages.news_content, this.props.data);
      }
    }
    else if(this.props.type == "innovation"||this.props.type == "workHard") {
      if(this.props.data.content&&this.props.data.content.indexOf("https://mp.weixin.qq.com") === 0 ||
          this.props.data.content&&this.props.data.content.indexOf("http://mp.weixin.qq.com") === 0) {
        this.gotoPage(Config.pages.chuangxin_web, {url:this.props.data.content, data:this.props.data});
      }
      else {
        this.gotoPage(Config.pages.wh_content, this.props.data);
      }
    }else if (this.props.type == "vipsercard_content") {
      this.gotoPage(Config.pages.vipactivitycontentpage, this.props.data)
    }
  }
}
